{include file="public/head"/}

<div class="container-fluid" id='main'>

    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="alert alert-dismissable alert-info">
                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                <p></p>
            </div>
        </div>
    </div>
   
   
    <div class="ntDesktop">
    	<div class="ntDesktop-head">{$title}</div>
        <input type="hidden" id="fun" value="{$fun}">

        <div class="row" style="padding:1em">
            <div class="col-md-1">
            	<a href="{:url($last_url)}" class="btn btn-default"><span class="fa fa-warehouse"></span> {$last} </a>
            </div>
            <div :class="is_edit=='loading'? 'col-md-8' : 'col-md-6'"> 
            	<select class="form-control" v-model="selval" @change="changeContainer">
                    <option value="0" v-if="is_edit=='loading'">{:lang('please_select')}</option>
                    <option :value="item.id" v-for="(item,index) in seldata" :key="item.id">{{item.id+' /'+item.name+' /'+item.ready_day+' /'+item.sum_ctn+'CTN /'+item.sum_kgs+'KGS /'+item.sum_cbm+'CBM /'+item.sum_value+'CNY /'}}</option>
                </select>
            </div>
            <template v-if="is_edit=='loading'">
            <div class="col-md-2">
                <button class='btn btn-default' @click="save('addLoading')"><span class="fa fa-dolly-flatbed"></span> {:lang('select_content_to_load_into_the_container')}</button>
            </div>
            <div class="col-md-1 text-right">
            	<div>
	            	<a href="{:url('admin/container/adjust')}" class="btn btn-primary">{:lang('enter_container_adjustment')} <span class="fa fa-arrow-alt-circle-right"></span></a>
                </div>
            </div>
             </template>
             <template v-else>
                <!-- <div class="col-md-1">
                    <button class='btn btn-default'><span class="fa fa-search"></span> 显示货柜内容</button>
                </div> -->
                <div class="col-md-4 text-right">
                    <div>
                        <button class='btn btn-default' @click="save('editAdjust')"><span class="fa fa-pallet"></span> {:lang('the_selected_content_is_returned_to_the_stock')}</button>
                        <button class='btn btn-primary' data-toggle="modal" data-target="#toContainer_editModal"><span class="fa fa-dolly-flatbed"></span>{:lang('move_selected_content_to_another_container')}</button>
                    </div>
                </div>
            </template>
        </div>

        <div class="row" style="padding-top:0px" v-if="is_edit=='loading'">
            <div class="col-md-6"> 
                <ul class="nav nav-tabs">
                    <li class="active">
                        <a href="#" data-toggle="tab">{:lang('all')}</a>
                    </li>
                    <li v-for="(item,index) in port" @click="changePort(item.id)">
                        <a href="#" data-toggle="tab">{{item.name}}</a>
                    </li>
                </ul>
            </div>
            
            <div class="col-md-6"> 
                <ul class="nav nav-tabs">
                    <li :class="{'active':index==0}" v-for="(item,index) in date" @click="changedate(index,true)">
                        <a href="javascript" data-toggle="tab">{{item.splyear+'-'+item.month}}</a>
                    </li>
                </ul>
            </div>
        </div>
    
        <div class="row">
            <div class="col-md-12">
				<table class="table table-striped table-hover ntTable" >
                    <thead>
                        <tr>
                            <th class="text-center" style="vertical-align:middle"><input type="checkbox" @click="allsel($event,'listdata')"></th>
                            <th>&nbsp;</th>
                            <th>{:lang('prodcut')}</th>
                            <th class="col-md-1">{:lang("box_quantity")}</th>
                            <th>{:lang("quantity")}</th>
                            <th>{:lang("weight")}</th>
                            <th>{:lang("volume")}</th>
                            <th>{:lang('amount')}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <template v-for="(item,index) in listdata.content">
                            <tr class="tr-mid">
                                <td style="vertical-align:middle" align="center"><input type="checkbox" v-model="listdata.content[index].is_che" @change="onesel($event,index,'listdata',true)"></td>
                                <td colspan="4">{{item.id+'/'+item.company_name+'/交货：'+item.port_name+'/'+item.delivery_day}}</td>
                                <td colspan="3" align="right">
                                        {{item.CTN}} <span class="unit">CTN</span> /
                                        {{item.KGS}} <span class="unit">KGS</span> /
                                        {{item.CBM}} <span class="unit">CBM</span> /
                                        {{item.CNY}} <span class="unit">CNY</span>
                                </td>
                            </tr>
                            <tr v-for="(element,key) in item.buy_po_pack">
                                    <td style="vertical-align:middle" align="center"><input type="checkbox" v-model="listdata.content[index].buy_po_pack[key].is_che"  @change="onesel($event,index,'listdata',false)"></td>
                                    <td style="vertical-align:middle" align="center" style="width: 48px;height:48;"><img  :src="element.proinfo.img_url" border="0"></td>
                                    <td> <small>{{element.proinfo.prochar_id+'/'+element.proinfo.brand_name+'/'+element.proinfo.model}}</small> <br />{{element.proinfo.pro_name}} </td>
                                    <td align="center"><input type="number" class="form-control text-right" v-model="listdata.content[index].buy_po_pack[key].qty" @input="changeVal('listdata',index,key)"></td>
                                    <td>
                                        {{element.ctn_qty}} <span class="unit">PCS/CTN</span><br>
                                        {{element.sum_qty}} <span class="unit">PCS</span>
                                    </td>
                                    <td>
                                        {{element.ctn_kgs}} <span class="unit">KGS/CTN</span><br>
                                        {{element.sum_kgs}} <span class="unit">KGS</span>
                                    </td>
                                    <td>
                                        {{element.ctn_size}} <span class="unit">CM</span><br>
                                        {{element.ctn_m3}} <span class="unit">CBM/CTN</span> / 
                                        {{element.sum_m3}} <span class="unit">CBM</span>
                                    </td>
                                    <td>
                                        {{element.price}} <span class="unit">CNY/PC</span><br>
                                        {{element.sum_price}} <span class="unit">CNY</span>
                                    </td>
                                </tr>
                        </template> 
                    </tbody>
                    <tfoot>
                        <tr>
                            <td colspan="2" align="center">{:lang('total')}</td>
                            <td colspan="6" align="right">
                                <b>
                                {:lang('product')}： {{listdata.footer.num}} <span class="unit">UN</span> / 
                                {:lang("box_quantity")}： {{listdata.footer.sum_CTN}} <span class="unit">CTN</span> / 
                                {:lang("volume")}： {{listdata.footer.sum_CBM}} <span class="unit">CBM</span> / 
                                {:lang("weight")}： {{listdata.footer.sum_KGS}} <span class="unit">KGS</span> / 
                                {:lang('amount')}： {{listdata.footer.sum_CNY}} <span class="unit">CNY</span>
                                </b>
                            </td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </div>

<!--添加弹窗部分 开始-->
<div class="modal fade" id="toContainer_editModal" tabindex="-1" role="dialog" aria-labelledby="ntModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog modal-lg" style="width:80%">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="ntModalLabel">{:lang('transfer_products_to_designated_container')}</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12">
                        <div class="alert alert-dismissable alert-info">
                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                            <p></p>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-1">指定货柜
                    </div>
                    <div class="col-md-11"> 
                        <select class="form-control" v-model="selval">
                            <option :value="item.id" v-for="(item,index) in seldata" :key="item.id">{{item.id+' /'+item.name+' /'+item.ready_day+' /'+item.sum_ctn+'CTN /'+item.sum_kgs+'KGS /'+item.sum_cbm+'CBM /'+item.sum_value+'CNY /'}}</option>
                        </select>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-12 div-scroll" style="max-height:50vh"> 
                        <table class="table table-striped table-hover ntTable" >
                            <thead>
                                <tr>
                                    <th class="text-center" style="vertical-align:middle"><input type="checkbox"  @click="allsel($event,'modellistdata')"></th>
                                    <th>&nbsp;</th>
                                    <th>{:lang('product')}</th>
                                    <th class="col-md-1">{:lang("box_quantity")}</th>
                                    <th>{:lang("quantity")}</th>
                                    <th>{:lang("weight")}</th>
                                    <th>{:lang("volume")}</th>
                                    <th>{:lang('amount')}</th>
                                </tr>
                            </thead>
                            <tbody>
                                <template v-for="(item,index) in modellistdata.content">
                                    <tr class="tr-mid">
                                        <td style="vertical-align:middle" align="center"><input type="checkbox" v-model="modellistdata.content[index].is_che" @change="onesel($event,index,'modellistdata',true)"></td>
                                        <td colspan="4">{{item.id+'/'+item.company_name+'/交货：'+item.port_name+'/'+item.delivery_day}}</td>
                                        <td colspan="3" align="right">
                                                {{item.CTN}} <span class="unit">CTN</span> /
                                                {{item.KGS}} <span class="unit">KGS</span> /
                                                {{item.CBM}} <span class="unit">CBM</span> /
                                                {{item.CNY}} <span class="unit">CNY</span>
                                        </td>
                                    </tr>
                                    <tr v-for="(element,key) in item.buy_po_pack">
                                            <td style="vertical-align:middle" align="center"><input type="checkbox" v-model="modellistdata.content[index].buy_po_pack[key].is_che"  @change="onesel($event,undefined,'modellistdata',true)"></td>
                                            <td style="vertical-align:middle" align="center"><img style="width: 48px;height:48;" :src="element.proinfo.img_url" border="0"></td>
                                            <td> <small>{{element.proinfo.prochar_id+'/'+element.proinfo.brand_name+'/'+element.proinfo.model}}</small> <br />{{element.proinfo.pro_name}} </td>
                                            <td align="center"><input type="number" class="form-control text-right" v-model="modellistdata.content[index].buy_po_pack[key].qty"></td>
                                            <td>
                                                {{element.ctn_qty}} <span class="unit">PCS/CTN</span><br>
                                                {{element.sum_qty}} <span class="unit">PCS</span>
                                            </td>
                                            <td>
                                                {{element.ctn_kgs}} <span class="unit">KGS/CTN</span><br>
                                                {{element.sum_kgs}} <span class="unit">KGS</span>
                                            </td>
                                            <td>
                                                {{element.ctn_size}} <span class="unit">CM</span><br>
                                                {{element.ctn_m3}} <span class="unit">CBM/CTN</span> / 
                                                {{element.sum_m3}} <span class="unit">CBM</span>
                                            </td>
                                            <td>
                                                {{element.price}} <span class="unit">CNY/PC</span><br>
                                                {{element.sum_price}} <span class="unit">CNY</span>
                                            </td>
                                        </tr>
                                </template> 
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td colspan="2" align="center">{:lang('total')}</td>
                                    <td colspan="6" align="right">
                                        <b>
                                            {:lang('product')}： {{modellistdata.footer.num}} <span class="unit">UN</span> / 
                                            {:lang("box_quantity")}： {{modellistdata.footer.sum_CTN}} <span class="unit">CTN</span> / 
                                            {:lang("volume")}： {{modellistdata.footer.sum_CBM}} <span class="unit">CBM</span> / 
                                            {:lang("weight")}： {{modellistdata.footer.sum_KGS}} <span class="unit">KGS</span> / 
                                            {:lang('amount')}： {{modellistdata .footer.sum_CNY}} <span class="unit">CNY</span>
                                        </b>
                                    </td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span>{:lang('cancel')}</button>
                <button type="button" class="btn btn-primary" data-dismiss="modal" @click="save('toContainer')" style="padding-left:24px;padding-right:24px"><span class="glyphicon glyphicon-floppy-disk"></span>{:lang('save')}</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
</div>
<script src="/static/Admin/js/loading.js"></script>
{include file="public/foot"/}
